/* common */
*, body{ margin: 0; padding: 0;}
ul{ list-style: none; }
ul li a,a{ text-decoration: none; color: #000; }
input{outline: none;}
.width{ width: 1200px; } 
.margin-center{ margin: 0 auto; }
.flex{ display: flex; align-items: center; }
.between{ justify-content: space-between; }
.center{ justify-content: center; }
.wrap{ flex-wrap: wrap; }
.text-center{ text-align: center; }
.bold{ font-weight: bold; }
.fl{ float: left; }
.color{ color: #df3615 !important; }
.top40{ margin-top: 40px; }
.top20{ margin-top: 20px; }
.top10{ margin-top: 10px; }
.left10{ margin-left: 10px; }
.left20{ margin-left: 20px; }
.left40{ margin-left: 40px; }
.right10{ margin-right: 10px; }
.colorfff{ color: #fff !important; }
.color595959{ color: #595959 !important; }
.centered {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* nav */
.head{ margin: 20px auto; }
.nav{ margin-left: 50px; }
.nav li{ float: left;margin-right: 36px;}
.nav li a{ padding-bottom: 4px; position: relative; }
.nav li a::before{ content:""; width:100%; position:absolute; display:inline-block; border-bottom:2px solid #df3615; bottom:0; left:-1000px;}
.nav-active a::before{ border-bottom: none !important;}
.nav li a:hover::before{ left:0; transition:all linear 0s;}
.nav li a:hover{ color: #df3615; }
.button div{ border: 1px solid #f5f5f5; border-radius: 20px; font-size: 13px; color: #6D6D6D; padding: 6px 40px; box-sizing: border-box; margin-left: 10px; }
.button div a{ color: #6d6d6d; }
.button div:hover,.button div:hover a{ color: #df3615; border-color: #df3615; }
.nav-active {border-bottom: 2px solid #df3615;}
.nav-active a {color: #df3615 !important;}
/* index */
.shadowed-text {
  text-shadow: 4px 4px 4px #000000; /* 羂翫抗�霡� ���翫�霡� 罔∞���緇� 蘂��� */
}
.paragraph{ font-size: 32px; color: #2c2c2c; margin-top: 35px; }
.underline{ width: 30px; border: 2px solid #df3615; margin-top: 20px; }
.hsjd{width:1200px;height:420;margin:40px auto}
.hsjd ul li{float:left;height:420px;width:100px;background-position:center center;background-repeat:no-repeat;background-size: cover; margin:0 6px;border-radius:0 20px 0 20px}
.hsjd ul .pic1{background-image:url('../img/hsjdfz.png');width:600px}
.hsjd ul .pic2{background-image:url('../img/hsjdpt.png')}
.hsjd ul .pic3{background-image:url('../img/hsjdqz.png')}
.hsjd ul .pic4{background-image:url('../img/hsjdxm.png')}
.hsjd ul .pic5{background-image:url('../img/hsjdzz.png')}
.hsjd ul .pic6{background-image:url('../img/hsjdly.png')}
.hsjd ul .pic7{background-image:url('../img/hsjdsm.png')}
.hsjd ul .pic8{background-image:url('../img/hsjdnp.png')}
.hsjd ul .pic9{background-image:url('../img/hsjdnd.png')}
.txt{background-color:#000;background:rgba(0,0,0,.5);height:420px;width:100%;border-radius:0 20px 0 20px;position:relative}
.mask{padding:30px;box-sizing:border-box;color:#fff;width:100%;height:100%;position:relative;display:none}
.mask1{font-size:32px;z-index:10;color:#fff;position:absolute;left:32%;top:18%}
.city{font-size:32px;margin-bottom:15px}
.look{position:absolute;right:30px;bottom:30px;width:200px}
.search{ background-color: #df3615; padding: 30px; box-sizing: border-box; width: calc(100% - 500px); height: 285px; }
.search-box{ background-color: #fff; border-radius: 10px; padding: 10px 100px 10px 40px; box-sizing: border-box; color: #595959; }
.top100{ width: 500px; height: 285px; background: url('../img/tuijian.png'); position: relative; }
.tag{ position: absolute; right: 30px; top: -10px; }
.search-input{ border: none; outline: none; }
.history div { display: inline-block; color: #fff; border: 1px solid #fff; font-size: 12px; padding: 4px 14px; box-sizing: border-box; border-radius: 20px; margin: 0 10px 10px 0;}
.history div:hover{ background-color: #fff; color: #595959; }
.hot{ color: #E0DFDC; font-size: 36px; position: absolute; top: 120px; right: 80px;}
.news, .rank{ width: 580px; height: 580px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); border-radius: 20px; overflow: hidden; }
.news .head1, .rank .head1{ background-color: #df3615; padding: 15px 40px; box-sizing: border-box; }
.message{ padding: 15px 40px; box-sizing: border-box; color: #797979; font-size: 14px; border-bottom: 1px solid #f5f5f5; }
.message .title{ color: #666 !important; font-size: 17px !important; }
.date{ color: #A3A8AF; font-size: 13px; }
.bottom{ position: relative; }
.copyright{ position: absolute; top: 150px; font-size: 32px; color: #fff; width: 100%; }
.button-group{ position: absolute; top: 240px; width: 100%; }
.button-group div{ border: 1px solid #fff; color: #fff; padding: 6px 20px; box-sizing: border-box; border-radius: 6px; display: inline-block; }
.button-group div:hover{ background-color: #fff;border: 1px solid #fff; }
.button-group div:hover a{ color: #000 !important;}
.gotop{ position: fixed; z-index: 20; right: 150px; bottom: 300px; display: none; }
#location{ display: none; width: 100%; height: 100vh; background-color: transparent; }
.hang{ border: 1px solid #fff; padding: 6px 20px; border-radius: 20px; display: inline-block; font-size: 14px; }
.mySwiper1 { display: none; }
.swiper-slide{ position: relative; }
.show{ position: absolute; left: 0; bottom: 40px; width: 100%; color: #fff; z-index: 20;  padding: 0 20px; box-sizing: border-box; }
.show div:first-child{ font-size: 20px; }
.fff-border{ border: 1px solid #fff; box-sizing: border-box; padding: 20px; }
/* modal */
.choose-city{ position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); z-index: 999; display: -none; }
.modal{ overflow: hidden; width: 500px; height: 500px; border-radius: 20px; background-color: #FFFAF4; position: relative; left: 50%; top: 50%; margin-left: -250px; margin-top: -250px; }
.modal-head{ position: relative}
.modal-title{ position: absolute; width: 100%; height: 100%;left: 0; top: 0; color: #fff;}
.close-modal{ position: absolute; width: 100%; height: 100%;left: 0; top: 0; color: #fff; text-align: right; justify-content: end; padding-right: 40px; box-sizing: border-box; font-size: 30px; }
.modal-center{ padding: 20px 40px; box-sizing: border-box; color: #595959; }
.location{ font-size: 14px; border: 1px solid #E0E0F4; padding: 6px 20px; background-color: #fff; border-radius: 10px; }
.search-box1{ border: 1px solid #E0E0F4; padding: 6px 20px; background-color: #fff; border-radius: 10px;  }
.city-list{ padding: 10px 30px; border-bottom: 1px solid #f5f5f5; font-size: 14px; }
.city-list input{ width: 20px; height: 20px; }
.confirm{ background-color: #df3615; color: #fff; border-radius: 20px; padding: 8px 40px; display: inline-block; font-size: 14px; }
.morefirm{ background-color: #df3615; color: #fff; border: 1px solid #fff; padding: 8px 40px; border-radius: 20px; font-size: 14px; }
.modal-bottom{ position: absolute; left: 0; bottom: 0; width: 100%; height: 40px; background-color: #E54E4A;}
/* login */
.loginbox{ padding: 60px 0; box-sizing: border-box; }
.login{ position: relative; width: 600px; border: 1px solid #df3615; border-radius: 20px; padding: 100px 80px 40px 80px; box-sizing: border-box; color: #6d6d6d; }
.login-txt{  }
.login-bottom{ position: fixed; left: 0; bottom: 0; z-index: -1; }
.pc-login{ position: absolute; right: 10px; top: 10px; }
.login-method{ position: absolute; right: 6px; top: 6px; z-index: 10; }
.login-input{ padding: 15px 40px; box-sizing: border-box; border: 1px solid #E8ECF4; background-color: #F7F8F9; border-radius: 50px; position: relative; }
.login-input input{ border: none; width: 100%; font-size: 16px; background-color: #F7F8F9; }
.code-btn{ border: 1px solid #df3615; color: #df3615; font-size: 12px; position: absolute; right: 20px; top: 10px; padding: 6px 20px; border-radius: 6px; }
.login-btn{ background-color: #df3615; border-radius: 50px; color: #fff; padding: 15px 0; font-size: 16px;  }
.change-login{ font-size: 14px; }
.hint{ font-size: 14px; margin-top: 10px; }
/* newslist */
.news-top{ padding: 50px 0; box-sizing: border-box; background: url('../img/newsbg.png'); background-repeat: no-repeat; background-size: cover; }
.city-list1{ padding: 20px 0; box-sizing: border-box; font-size: 14px; border-bottom: 1px solid #f5f5f5; }
.city-box,.city-box1{ padding: 10px 20px;border-radius: 20px; }
.city-box:hover{ background-color: #df3615; color: #fff;   }
.prev-next{ border: 1px solid #aaaaaa; width: 40px; height: 30px; text-align: center;  line-height: 30px; border-radius: 2px; }
.news-list{ border-bottom: 1px solid #f5f5f5; padding: 30px 0; box-sizing: border-box; }
/* newsDetail */
.news-right{ overflow: hidden; border: 1px solid #E2E2E3; border-radius: 20px; padding: 40px; box-sizing: border-box; }
.history1{ padding: 40px; }
.history1 div { display: inline-block; color: #595959; border: 1px solid #595959; font-size: 12px; padding: 4px 14px; box-sizing: border-box; border-radius: 20px; margin: 0 10px 10px 0;}
.more-news{ background-color: #E2E2E3; color: #6E6D7A; padding: 10px 20px; box-sizing: border-box; border-radius: 10px; }
/* gallery list */
.gallery{ width: 290px;  }
/* gallery detail */
.gallery-img{  border-radius: 10px; }
.tag1 div{ display: inline-block; background-color: #fff; color: #df3615; font-size: 12px; padding: 2px 10px; box-sizing: border-box; border-radius: 4px; }
.gallery-square{position: relative;}
.up-triangle { display: none; position: absolute; bottom: -10px; left: 50%; margin-left: -15px; width: 0; height: 0; border-style: solid; border-width: 0 15px 20px 15px; border-color: transparent transparent #fff transparent;}

/* my */
.my-wrap{ background-color: #FFFAF4; padding: 40px; box-sizing: border-box; }
.my-box{ width: 290px; background-color: #fff; border-radius: 20px; border: 1px solid #E3E3E3; padding: 20px; box-sizing: border-box; }
.match{ width: 100%; }

/*answer*/
.wrapper {
	/* width: 100%; */
	
	margin: 0 auto;
	top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;

}

.card_wrap {
	height: 1084px;
	position: relative;
	overflow: hidden;
	display: none
}

.card_cont {
	width: 100%;
	height: 1084px;
	box-sizing: border-box;
	margin: 0 auto;
	position: absolute;
	background-size: 100% auto;
	padding: 8px 20px 18px;
	transition: all ease .5s;
	-webkit-transition: all ease .5s;
	-moz-transition: all ease .5s;
	-ms-transition: all ease .5s;
	transform: scale(0, 0);
	-moz-transform: scale(0, 0);
	-ms-transform: scale(0, 0);
	-o-transform: scale(0, 0);
	-webkit-transform: scale(0, 0);
	/* bottom: 0; */
	margin-top: 10px;
	display: none;
}

.card {
	height: 100%;
	position: relative;
	margin: 0 auto;
}

.card .card_bottom {
	width: 100%;
	position: absolute;
	bottom: 15px;
	left: 0;
	box-sizing: border-box;
	padding: 0 28px
}

.card .card_bottom a {
	color: rgb(123, 179, 145);
	cursor: pointer
}

.card .card_bottom span {
	float: right;
	color: #909090
}

.card .card_bottom span b {
	color: #666;
	font-weight: inherit
}

.card_cont.card1 {
	display: block;
	transform: scale(1, 1) translate(0, 0) !important;
	-ms-transform: scale(1, 1) translate(0, 0) !important;
	-moz-transform: scale(1, 1) translate(0, 0) !important;
	-webkit-transform: scale(1, 1) translate(0, 0) !important;
}

.card_cont.card2 {
	display: block;
	transform: scale(.85, .85) translate(0, -62px) !important;
	-ms-transform: scale(.85, .85) translate(0, -62px) !important;
	-moz-transform: scale(.85, .85) translate(0, -62px) !important;
	-webkit-transform: scale(.85, .85) translate(0, -62px) !important;
}

.card_cont.card3 {
	display: block;
	transform: scale(.72, .72) translate(0, -135px) !important;
	-ms-transform: scale(.72, .72) translate(0, -135px) !important;
	-moz-transform: scale(.72, .72) translate(0, -135px) !important;
	-webkit-transform: scale(.72, .72) translate(0, -135px) !important;
}

.card_cont.cardn {
	display: block;
	transform: translate(0, -1000px) !important;
	-moz-transform: translate(0, -1000px) !important;
	-ms-transform: translate(0, -1000px) !important;
	-webkit-transform: translate(0, -1000px) !important;
}

.question {
	width: 100%;
	font-size: 16px;
	font-weight: 100;
	color: #595959;
	line-height: 1.4;
	vertical-align: middle;
	padding: 40px 10px 10px 10px;
	box-sizing: border-box;
	/* background: url('../images/skin_thumbs_bar.png') no-repeat; */
	background-size: cover;
}

/* .question span{margin-left:-1em} */
.commit {
	width: 150px;
	height: 48px;
	margin: 20px auto auto auto;
}

.btn_commit {
	display: block;
	width: 150px;
	height: 48px;
	background: url(test_btncommit.png) no-repeat center center;
	background-size: 100% 100%;
	border: none;
	background-color: transparent;
	display: none
}

/*Radio Specific styles*/
input[type='radio'] {
	display: none;
	cursor: pointer;
}

input[type='radio']:focus,
input[type='radio']:active {
	outline: none;
}

input[type='radio']+label {
	cursor: pointer;
	display: inline-block;
	position: relative;
	padding-left: 28px;
	color: #666;

}

input[type='radio']:checked+label {
	color: rgb(123, 179, 145) !important;
}

input[type='radio']+label:before,
input[type='radio']+label:after {
	content: '';
	font-family: helvetica;
	display: inline-block;
	width: 20px;
	height: 20px;
	left: 0;
	top: 0;
	text-align: center;
	position: absolute;
}

input[type='radio']+label:before {
	background-color: transparent;
}

input[type='radio']+label:after {
	color: rgb(123, 179, 145);
}

input[type='radio']:checked+label:before {
	-moz-box-shadow: inset 0 0 0 5px #fff;
	-webkit-box-shadow: inset 0 0 5px #fff;
	box-shadow: inset 0 0 0 5px #fff;
	border: 1px solid rgb(123, 179, 145);
	background-color: rgb(123, 179, 145);
}

input[type='radio']+label:before {
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	border-radius: 50%;
	border: 1px solid rgb(123, 179, 145);
}

input[type='radio']+label:hover:after {
	color: rgb(123, 179, 145);
}

input[type='radio']:checked+label:after,
input[type='radio']:checked+label:hover:after {
	color: rgb(123, 179, 145);
}

ul.select {
	width: 80%;
	padding: 20px 20px 0 20px;
	box-sizing: border-box;
}
.bottom-div {
        position: fixed;
        bottom: 0;
    }

ul.select li {
	line-height: 1.5;
	margin: 0 0 20px 0;
	border: 1px solid #dfdfdf;
	border-radius: 10px;
	padding: 15px 40px;
	box-sizing: border-box;
	color: #595959;
	font-size: 14px;
}

.analysis {
	padding: 10px;
	font-size: 14px;
	/* display: none; */
}

.correct {
	background-color: #36C400 !important;
	background: url('../images/right.png') no-repeat;
	background-size: 25px;
	background-position: 5px;
	color: #fff !important;
}

.wrong {
	background-color: #FF992B !important;
	background: url("../images/wrong.png") no-repeat;
	background-size: 25px;
	background-position: 5px;
	color: #fff !important;
}

@media screen and (max-width: 1200px) {
    .match{
		width: 1200px !important;
	}
}